import React from 'react';
import { createBrowserRouter, RouteObject } from 'react-router-dom';
import { Suspense } from 'react';
import { Spin } from 'antd';
import remainingRoutes, { RouteConfig } from './modules/remaining';

// 路由加载组件
const RouteLoading = () => (
  <div style={{ 
    display: 'flex', 
    justifyContent: 'center', 
    alignItems: 'center', 
    height: '100vh' 
  }}>
    <Spin size="large" />
  </div>
);

// 转换路由配置为React Router格式
const transformRoutes = (routes: RouteConfig[]): RouteObject[] => {
  return routes.map(route => {
    const routeObject: RouteObject = {
      path: route.path,
      element: route.element ? (
        <Suspense fallback={<RouteLoading />}>
          {route.element}
        </Suspense>
      ) : undefined
    };

    if (route.children) {
      routeObject.children = transformRoutes(route.children);
    }

    return routeObject;
  });
};

// 创建路由实例
const router = createBrowserRouter(transformRoutes(remainingRoutes), {
  basename: '/'
});

// 重置路由函数
export const resetRouter = (): void => {
  // React Router v6 不支持动态删除路由，这里可以根据需要实现
  console.log('Router reset functionality would be implemented here');
};

// 获取路由实例
export const getRouter = () => {
  return router;
};

export default router;